
<ion-header>
  <ion-navbar>
    <button ion-button menuToggle>
      <ion-icon name="menu"></ion-icon>
    </button>
    <ion-title>
      <div style="margin: 15px 0" >
        <p>逾期未取餐</p>
      </div>
    </ion-title>
    <ion-buttons *ngIf="messageCount > 0" end>
      <button tappable ion-button icon-only (click)="gotoUnreadMessage()" >
        <ion-icon color="Gray-color" name="ios-mail-outline">
          <ion-badge class="bage-message">{{messageCount}}</ion-badge>
        </ion-icon>
      </button>
    </ion-buttons>
    <ion-buttons end>
      <button tappable ion-button icon-only (click)="gotoHomePage()" >
        <ion-icon color="Gray-color" name="ios-home-outline">
        </ion-icon>
      </button>
    </ion-buttons>
    <ion-buttons end>
      <button tappable ion-button icon-only (click)="goSettingPage()" >
        <ion-icon color="Gray-color" name="settings">
        </ion-icon>
      </button>
    </ion-buttons>
  </ion-navbar>
</ion-header>


<ion-content>
  <ion-list *ngIf="orderList?.length > 0" >
    <ion-item *ngFor="let item of orderList">
      <h2>{{item.productName}}</h2>
      <div item-end>
        <h3 style="margin-left: 10px">{{item.price}}元</h3>
      </div>
      <p style="line-height: 35px;">
        <ion-badge color="light" style="color: #bfbfbf">{{item.mealType}}</ion-badge>
        {{item.dinnerDate}} {{item.factoryName}}-{{item.officeName}}
      </p>
    </ion-item>
  </ion-list>

  <!--<div *ngIf="orderList?.length === 0" style="margin-left: 40vw;margin-top: 20vh;font-size: 2rem">-->
    <!--暂无数据-->
  <!--</div>-->

  <div class="null-tips" *ngIf="(isNull && orderList.length === 0)">
    <img src="assets/imgs/null.png" alt="">
    <div>暂无数据</div>
  </div>

</ion-content>
